<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%
    String path = request.getContextPath();
    request.setAttribute("path",path);
%>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title>地址管理</title>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <link rel="stylesheet" type="text/css" href="${path}/css/css.css" />
    <link rel="stylesheet" type="text/css" href="${path}/css/style.css" />
    <link rel="stylesheet" type="text/css" href="${path}/css/menu.css" />
    <link rel="stylesheet" type="text/css" href="${path}/css/address.css" />
    <script type="text/javascript"
            src="https://cdn.bootcss.com/jquery/3.2.1/jquery.min.js"></script>
    <script src="${path}/layer/layer.js" type="text/javascript"></script>
    <script src="${path}/js/main.js" type="text/javascript"></script>
    <script src="https://cdn.bootcss.com/distpicker/2.0.3/distpicker.js"></script>
    <script type="text/javascript">
/*删除方法*/
        function del(id){
            let addressId=id;
            console.log(id);
            layer.confirm('确定要删除吗？', {
                btn: ['确定','取消'] //按钮
            }, function(){
                $.post("AddressServlet/del",{"addressId":id},function (data) {
                   if (data==1){
                       location.reload();
                   }else {
                       layer.msg('删除失败');
                   }
                },"text");
            });
        }
        //修改默认地址
        $(function () {
          $(".updateDefault").click(function () {
              let addressId = this.id;
              $.post("AddressServlet/updateDefault",{"addressId":addressId},function (data) {
                  if (data==1){
                      location.reload();
                  }
              },"text");
          })
        })
        //修改地址
       function updateads(p,c,d,de,id) {
           let province =$("#"+p+" option:selected").text();
           let city =$("#"+c+" option:selected").text();
           let district =$("#"+d+" option:selected").text();
           let describe =$("#"+de).val();
           let addressId=id;
           if (province.length<0||city.length<0||district.length<0||describe.length<0){
               layer.msg('请填取完整的地址');
           }else {
               $.post("AddressServlet/updateads",{"addressProvince":province,
               "addressCity":city,"addressDistrict":district,"addressDescribe":describe,
                "addressId":id
               },function (data) {
                   if (data==1){
                       location.reload();
                   }else {
                       layer.msg('修改失败');
                   }
               },"text");
           }
       }
       //添加地址
        function Address() {
            let province =$("#province option:selected").text();
            let city =$("#city option:selected").text();
            let district =$("#district option:selected").text();
            let describe =$("#describe").val();
            if (province.length<0||city.length<0||district.length<0||describe.length<0){
                layer.msg('请填取完整的地址');
            }else {
                $.post("AddressServlet/addAds",{"addressProvince":province,
                    "addressCity":city,"addressDistrict":district,"addressDescribe":describe
                },function (data) {
                    if (data==1){
                        location.reload();
                    }else {
                        layer.msg('添加失败');
                    }
                },"text");
            }

        }

    </script>

</head>
<body>
<div class="m-main">
    <div class="m-food">
        <div class="mf-top border-t">
            <div>
                地址管理
            </div>
        </div>
        <c:forEach items="${aList}" var="list" varStatus="i">
            <div class="mf-menu border-t"
                 style="height: auto; line-height:7px; padding: 30px 0">

                <div class="fl">
                    <span class="m-wt"></span>
                    <span>${list.addressProvince}${list.addressCity}${list.addressDistrict}${list.addressDescribe}</span>
                    <span ><c:if test="${list.addressDefault eq 'Y'}">
                        默认地址 <input type="radio" checked="checked" class="updateDefault" id="${list.addressId}" />
                    </c:if>
                     <c:if test="${list.addressDefault eq 'N'}">
                         设置默认地址  <input type="radio" class="updateDefault" id="${list.addressId}"/>
                     </c:if>
                    </span>
                </div>
                <div class="fr">
                    <button class="xiugai dingwei" onclick="change('address${i.count}',1)">
                        修改
                    </button>
                    <button class="del dingwei" onclick="del(${list.addressId})">
                        删除
                    </button>
                </div>

                <div style="display: none;" class="change" id="update_address${i.count}">
                    <div style="padding-top: 20px" class="clear">
                        <span class="m-wt" style="padding: 0 30px; width: 70px"></span>
                        <div data-toggle="distpicker" style="margin-left: 120px">
                            <select id="province${i.count}" data-province="${list.addressProvince}"></select>-<!-- 省 -->
                            <select id="city${i.count}" data-city="${list.addressCity}"></select>-<!-- 市 -->
                            <select id="district${i.count}" data-district="${list.addressDistrict}"></select>-<!-- 区 -->
                            <input type="text" id="describe${i.count}" class="t-ad" style="width: 150px" value="${list.addressDescribe}" />
                        </div>
                    </div>

                    <div class="act-botton clear"
                         style="margin: 10px 0 10px 15px; padding: 10px 0">
                        <div class="save-button">
                            <a href="javascript:" class="radius" onclick="updateads('province${i.count}','city${i.count}','district${i.count}','describe${i.count}'
                                ,${list.addressId})">保存</a>
                        </div>
                        <div class="cancel-button">
                            <a href="javascript:" class="radius"
                               onclick="change('address${i.count}',2)">取消</a>
                        </div>
                    </div>
                </div>
            </div>

        </c:forEach>
    </div>

    <div class="mf-top" style="margin-top: 30px">
        <div id="addaddress">
            <div style="line-height: 40px">
                <span class="m-wt" style="padding: 0 30px"></span><a href="#" class=" rb-red" onclick="change('addaddress',3)">+使用新地址</a>
            </div>
        </div>
        <div style="display: none;" id="insert_addaddress" class="change">
            <div style="margin-top: 20px">
                <span class="m-wt" style="padding: 0 30px"></span>
                <div data-toggle="distpicker" style="margin-left: 120px">
                    <select id="province"></select>-<!-- 省 -->
                    <select id="city"></select>-<!-- 市 -->
                    <select id="district"></select>-<!-- 区 -->
                    <input type="text" id="describe" class="t-ad" style="width: 150px"  />
                </div>
            </div>

            <div class="act-botton clear"
                 style="margin: 20px 40px; padding: 20px 0">
                <div class="save-button">
                    <a href="javascript:" class="radius" onclick="Address()">保存</a>
                </div>
                <div class="cancel-button">
                    <a href="javascript:" class="radius"
                       onclick="change('addaddress',4)">取消</a>
                </div>
            </div>
        </div>
        <div class="area clear"
             style="margin-top: 60px; font-size: 14px; color: #999">
            <span class="m-wt" style="padding: 0 30px"></span> 友情提示：
            <br />
            <span class="m-wt" style="padding: 0 30px"></span>如果您选择不设置密码，您送餐信息的主要内容会以*号遮蔽，如：虹桥路2号，会显示为“虹﹡……﹡2号”。
            <br />
            <span class="m-wt" style="padding: 0 30px"></span>该显示信息可能不受保护，建议您设置密码。
        </div>
    </div>
</div>
</body>
</html>
